Ext.define('HRMobile.view.YourLeaveRequestListForm', {
	extend : 'Ext.Container',
	controllers : [ 'LeaveController' ],
	config : {
		height : '100%',
		items : [ {
			xtype : 'toolbar',
			title : 'Leave Requests',
			docked : 'top',
			items:[{
				xtype : 'button',
				margin: 10,
				iconMask: true,
				iconCls: 'add',
				id: 'btnAdd'
			}]
		}, {
			xclass : 'HRMobile.view.YourLeaveRequestList',
			id : 'yourleaverequestlist'
		}, {
			xclass : 'HRMobile.view.YourLeaveRequestDetails',
			id : 'yourleaverequestdetails'
		}, {
			xclass : 'HRMobile.view.YourLeaveRequestAdd',
			id : 'yourleaverequestadd'
		} ]
	}

});
Ext
		.define(
				'HRMobile.view.YourLeaveRequestList',
				{
					extend : 'Ext.dataview.List',
					config : {
						store : 'YourLeaveRequestStore',
						plugins : [ {
							xclass : 'Ext.plugin.PullRefresh',
						} ],
						height : '100%',
						itemTpl : '<div style="font-size:.8em"><b>Leave from [{firstLeave}] to [{lastLeave}]</b></div>'
								+ '<div style="font-size:.8em">Leave Type: {leaveType}</div>'
								+ '<div style="font-size:.8em">Status: <span style = "color:{statusColor}">{status}</span></div>',
						onItemDisclosure : true,
					},
				});
Ext.define('HRMobile.view.YourLeaveRequestDetails', {
	extend : 'Ext.form.Panel',
	config : {
		modal : true,
		centered : true,
		hideOnMaskTap : true,
		hidden : true,
		width : Ext.os.is.Phone?320:600,
		height : Ext.os.is.Phone?320:580,
		hideAnimation : {
			type : 'popOut',
			duration : 250,
			easing : 'ease-out'
		},
		styleHtmlContent : true,
		defaults : {
			xtype : 'fieldset',
			defaults : {
				xtype : 'textfield',
				readOnly : true,
				labelWidth: '35%',
				labelWrap: true
			}
		},
		items : [ {
			xtype : 'toolbar',
			docked : 'top',
			items : [ {
				xtype : 'spacer'
			}, {
				xtype : 'button',
				text : 'Done',
				handler : function() {
					Ext.getCmp('yourleaverequestdetails').hide();
				}
			}, ],
		}, {
			title : 'Leave Request Details',
			items : [ {
				label : 'Supervisor:',
				name : 'empFullName',
			}, {
				label : 'Leave Type:',
				name : 'leaveType',
			}, {
				label : 'Leave From :',
				name : 'firstLeave',
			}, {
				label : 'Leave To:',
				name : 'lastLeave',
			}, {
				label : 'Employee Comment:',
				name : 'empComment',
				xtype : 'textareafield',
				maxRows : 3,
			} ]
		},{
			items: [{
				label: 'Status',
				name: 'status'
			},{
				label: 'Sup\'s Comment:',
				name: 'supComment',
				xtype : 'textareafield',
				maxRows : 3,
			}]
		} ]
	}
});
Ext.define('HRMobile.view.YourLeaveRequestAdd', {
	extend : 'Ext.form.Panel',
	config : {
		modal : true,
		centered : true,
		hideOnMaskTap : true,
		hidden : true,
		width : Ext.os.is.Phone?320:600,
		height : Ext.os.is.Phone?320:450,
		hideAnimation : {
			type : 'popOut',
			duration : 250,
			easing : 'ease-out'
		},
		styleHtmlContent : true,
		defaults : {
			xtype : 'fieldset',
			defaults: {
				labelWidth: '35%',
				labelWrap: true
			}
		},
		items : [ {
			xtype : 'toolbar',
			docked : 'top',
			items : [ {
				xtype : 'spacer'
			}, {
				xtype : 'button',
				text : 'Done',
				handler : function() {
					Ext.getCmp('yourleaverequestadd').hide();
				}
			}, ],
		}, {
			title : 'Add Leave Request',
			items : [ {
				label : 'Supervisor:',
				name : 'supervisor',
				xtype: 'selectfield',
				store: 'MySupervisorStore',
				displayField: 'empFullName',
				valueField: 'empNumber'
			}, {
				label : 'Leave Type:',
				name : 'leaveType',
				xtype: 'selectfield',
				options :[{
					text: 'Onsite',
					value: 1
				},{
					text: 'Paid Leave',
					value: 2
				},{
					text: 'Non-paid Leave',
					value: 3
				}]
			}, {
				label : 'Leave From:',
				name : 'firstLeave',
				xtype : 'datepickerfield',
				value : new Date()
			},{
				label: 'Time:',
				xtype: 'selectfield',
				name: 'firstLeaveTime',
				options :[{
					text: '7:30',
					value: '7:30'
				},{
					text: '12:00',
					value: '12:00'
				},{
					text: '18:00',
					value: '18:00'
				}]
			}, {
				label : 'Leave To:',
				name : 'lastLeave',
				xtype : 'datepickerfield',
				value : new Date()
			},{
				label: 'Time:',
				xtype: 'selectfield',				
				name: 'lastLeaveTime',
				options :[{
					text: '7:30',
					value: '7:30'
				},{
					text: '12:00',
					value: '12:00'
				},{
					text: '18:00',
					value: '18:00'
				}]
			}, {
				label : 'Employee Comment:',
				name : 'empComment',
				xtype : 'textareafield',
				maxRows : 3,
			} ]
		},{
			xtype: 'button',
			ui: 'action',
			text: 'Submit',
			margin: 'auto',
			width: 150,
			id: 'btnSubmit',
			handler: function(){
				this.getParent().submit({
					url: 'LeaveInsertServlet',
				    method: 'POST',
				    params: {
		                userId: localStorage.userId
		            },
				    success: function(form,result) {
				    	if (result.isValid == true){
				    		Ext.Msg.alert("Alert","Your request has been submitted",function(){
								Ext.getCmp('yourleaverequestadd').hide();
					    		Ext.getStore('YourLeaveRequestStore').load();
					    	});
				    	}
				    	else {
				    		Ext.Msg.alert('Error',result.msg);
				    	}
				    		
				    }
				});
			}
		} ]
	}
});